<template>
  <!-- 继续率试算 -->
  <Card>
    <Form :model="form" ref="form" :rules="rules" label-position="right" label-width="100" style="display: block;">
      <Row gutter="10">
        <i-col span="6">
          <FormItem label="选择渠道" prop="salechnl">
            <Select v-model="form.salechnl" @on-change="salechnlChange" clearable>
              <Option v-for="item in saleChannelList" :value="item.key" :key="item.key">{{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="管理机构" prop="managecom">
            <Select v-model="form.managecom" clearable>
              <Option v-for="item in organizationList" :value="item.key" :key="item.key">{{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="销售机构">
            <Select v-model="form.agentgroup" @on-change="val => getBranchmanager(val, { fileByte: 'branchmanager' })"
              clearable>
              <Option v-for="item in agentgroupList" :value="item.key" :key="item.key">{{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="区部组">
            <Select v-model="form.branchmanager" clearable>
              <Option v-for="item in groupDistrictList" :value="item.key" :key="item.key">{{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
      </Row>
      <Row gutter="10">
        <i-col span="6">
          <FormItem label="员工工号">
            <Input v-model="form.agentcode" clearable placeholder="请输入" />
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="统计年月" prop="analyzeDate">
            <DatePicker v-model="form.analyzeDate" @on-change="val => $set(form, 'analyzeDate', val)" format="yyyy-MM"
              type="month" placeholder="请选择" />
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="继续率类型" prop="continueType">
            <Select v-model="form.continueType" clearable>
              <Option v-for="item in continueTypeArr" :value="item.key" :key="item.key">
                {{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
        <i-col span="6">
          <FormItem label="统计频次" prop="frequency">
            <Select v-model="form.frequency" :disabled="fDis" clearable>
              <Option v-for="item in frequencyArr" :value="item.key" :key="item.key">
                {{ item.value }}</Option>
            </Select>
          </FormItem>
        </i-col>
      </Row>
      <Row>
        <i-col span="24" style="display: flex;justify-content: flex-end;">
          <Button type="primary" @click="loadResources" :loading="isLoading" icon="md-search"
            style="margin-right:20px;">查询</Button>
          <Button @click="resetForm(), getMonth(), frequencyArr = []" icon="md-refresh">重置</Button>
        </i-col>
      </Row>
    </Form>

    <Button @click="checkMust() && batchExport({
      url: '/scrm-bhuer/api/export/ContinueExport',
      tableData: tableData,
      name: getName(),
      msg: '列表无数据，不可进行此操作！'
    })" :loading="exPortLoading">导出清单</Button>

    <Table :columns="columns" :data="tableData" :loading="isLoading" show-summary :summary-method="handleSummary"
      class="sum-table" style="margin-top:10px">
    </Table>

    <Page :total="ipagination.total" show-sizer show-total style="text-align:right;margin-top:20px"
      @on-change="handleCurrentChange" @on-page-size-change="handleSizeChange"
      :page-size-opts="ipagination.pageSizeOptions" :current="ipagination.index" :page-size="ipagination.pageSize"
      transfer></Page>
  </Card>
</template>

<script>
import { batchExport } from "../../util/mixins/batchExportMixin";
import { getSelectListMixin } from "../../util/mixins/getSelectListMixin";
import { loadResourcesMixin } from "../../util/mixins/loadResourcesMixin";
import { tableChangeMixin } from "../../util/mixins/tableChangeMixin";
export default {
  name: "continueRate",
  mixins: [
    loadResourcesMixin,
    tableChangeMixin,
    getSelectListMixin,
    batchExport,
  ],
  data() {
    return {
      mixinData: {
        tableAxios: "ContinueRate",
        disableMixinCreated: true,
      },
      continueTypeArr1: [
        { key: "1", value: "13个月继续率" },
        { key: "2", value: "25个月继续率" },
        { key: "3", value: "37个月及以上继续率" },
      ],
      continueTypeArr: [],
      frequencyArr1: [
        { key: "1", value: "月度" },
        { key: "2", value: "季度" },
        { key: "3", value: "年度" },
      ],
      frequencyArr: [],
      rules: {
        salechnl: [
          {
            required: true,
            message: "请选择渠道",
            trigger: "change",
          },
        ],
        managecom: [
          {
            required: true,
            message: "请选择管理机构",
            trigger: "change",
          },
        ],
        analyzeDate: [
          {
            required: true,
            message: "请选择统计年月",
            trigger: "change",
          },
        ],
        continueType: [
          {
            required: true,
            message: "请选继续率类型",
            trigger: "change",
          },
        ],
        frequency: [
          {
            required: true,
            message: "请选择统计频次",
            trigger: "change",
          },
        ],
      },
      columns: [
        {
          title: "序号",
          type: "index",
          align: "center",
          width: "70",
        },
        {
          title: "管理机构",
          key: "managename",
          align: "center",
          width: "200",
        },
        {
          title: "销售机构",
          key: "agentgroupname",
          align: "center",
          width: "200",
        },
        {
          title: "主管姓名",
          key: "branchmanagername",
          align: "center",
          width: "100",
        },
        {
          title: "员工姓名",
          key: "agentname",
          align: "center",
          width: "100",
        },
        {
          title: "员工工号",
          key: "agentcode",
          align: "center",
          width: "120",
        },
        {
          title: "渠道",
          key: "salechnlname",
          align: "center",
          width: "80",
        },
        {
          title: "统计年月",
          key: "analyzeDate",
          align: "center",
          width: "100",
        },
        {
          title: "继续率应收件数",
          key: "receivableCount",
          align: "center",
          width: "140",
          allByte: 1,
        },
        {
          title: "继续率应收保费",
          key: "receivables",
          align: "center",
          width: "140",
          allByte: 1,
        },
        {
          title: "实收件数",
          key: "receiptCount",
          align: "center",
          width: "100",
          allByte: 1,
        },
        {
          title: "实收保费",
          key: "receipts",
          align: "center",
          width: "100",
          allByte: 1,
        },
        {
          title: "件数继续率",
          key: "tcontinueCount",
          align: "center",
          width: "110",
          allByte: 1,
        },
        {
          title: "保费继续率",
          key: "tcontinuePremium",
          align: "center",
          width: "110",
          allByte: 1,
        },
      ],
      // tableData: [{ 1: 1 }],
      allAchievingObj: {},
      fDis: false,
      form: {
        // visitType: "0",
        // analyzeDate: "2022-12",
        // salechnl: "2",
        // frequency: "1",
        // managecom: "861200",
        // continueType: "1",
      },
    };
  },
  created() {
    this.getMonth();
  },
  methods: {
    salechnlChange(val) {
      // 如果渠道选择了续期，则统计频次置灰，不能选择，
      // 如渠道为网销，则统计频次置灰
      // 如果渠道是银保，则统计频次枚举有月度/季度/年累计，
      // 如果渠道枚举为个险，则统计频次默认为滚动，且只能选择滚动，
      // 如果渠道为多元，则统计频次只能选择月度；
      // 2 多元；3 银保；1 个险；6 续期；7 网销
      // console.log(val);
      if (val == 1) {
        this.continueTypeArr = [this.continueTypeArr1[0]]
        this.form.continueType != 1 && this.$set(this.form, 'continueType', '')
      } else this.continueTypeArr = JSON.parse(JSON.stringify(this.continueTypeArr1))
      if (val == 3)
        this.frequencyArr = JSON.parse(JSON.stringify(this.frequencyArr1));
      else if (val == 2) this.frequencyArr = [{ key: "1", value: "月度" }];
      else if (val == 1) this.frequencyArr = [{ key: "4", value: "滚动" }];
      else if (val == 6 || val == 7) {
        this.$nextTick(() => this.$set(this.form, "salechnl", ""));
        return this.$Message.info("不支持查询该渠道的持续率");
      }
      this.$set(this.form, "frequency", "");
    },
    getName() {
      let managecom = "",
        continueType = "",
        frequency = "";
      this.organizationList.forEach(
        (item) => item.key == this.form.managecom && (managecom = item.value)
      );
      this.continueTypeArr.forEach(
        (item) => item.key == this.form.continueType && (continueType = item.value)
      );
      this.frequencyArr.forEach(
        (item) => item.key == this.form.frequency && (frequency = item.value)
      );

      // return `${getManagecom}-${this.form.analyzeDate}-${payCount}-${achievingRateType}.xlsx`;
      return `${managecom}-${this.form.analyzeDate}-${continueType}-${frequency}.xlsx`;
    },
    // 获取总计
    loadDataAfter() {
      // loadDataBefore() {
      this.api.AllContinueRate(this.form).then((res) => {
        if (res.code == 200) this.allAchievingObj = res.data;
        else this.$Message.info(res.msg);
      });
    },
    // 算总价
    handleSummary({ columns }) {
      const sums = {};
      columns.forEach((column, index) => {
        const key = column.key;
        if (index === 0) {
          sums[key] = {
            key,
            value: "合计",
          };
        } else if (column.allByte) {
          sums[key] = {
            key,
            value: this.allAchievingObj[column.key],
            // 100 + " 元" + column.allByte,
          };
        } else
          sums[key] = {
            key,
            value: "",
          };
      });
      // console.log("sums", sums);
      return sums;
    },
    checkMust() {
      let flag;
      this.$refs.form.validate((valid) => (flag = valid));
      return flag;
      return true;
      // {
      //   if (valid) {
      //   } else {
      //   }
      // }
    },
    getMonth() {
      let date = new Date(),
        year = date.getFullYear(),
        month = date.getMonth() + 1;
      this.$set(
        this.form,
        "analyzeDate",
        `${year}-${month > 9 ? month : "0" + month}`
      );
    },
  },
};
</script>
<style>
.sum-table>.ivu-table>div>.ivu-table-summary>.ivu-table-tbody>.ivu-table-row>.ivu-table-column-center {
  background: #fff6f4 !important;
  color: #ff4722 !important;
}
</style>